<template>
    <svg-icon @click.native="onToggle" id="guide-full" :icon="isScreenFull?'exit-fullscreen':'fullscreen'"></svg-icon>
</template>

<script>
import screenfull from "screenfull"
export default {
    name: '',

    data() {
        return {
            isScreenFull:false,
        };
    },

    mounted() {
        screenfull.on("change",this.change)
    },

    methods: {
        onToggle(){
            screenfull.toggle()
        },
        change(){
            this.isScreenFull = screenfull.isFullscreen
        }
    },
};
</script>

<style lang="scss" scoped>
</style>